import React, { useState } from 'react';
import { Button, Modal, Form, Input, Radio, message } from 'antd';

const CollectionCreateForm = ({ visible, onCreate, onCancel, shouldOld }) => {
  const [form] = Form.useForm();
  return (
    <Modal
      visible={visible}
      title="请修改密码"
      okText="确定"
      cancelText="取消"
      onCancel={onCancel}
      width={400}
      onOk={() => {
        form
          .validateFields()
          .then((values) => {
            const { password, confirmPassword } = values;
            if (password === confirmPassword) {
              form.resetFields();
              onCreate(values);
            } else {
              message.info('两次密码不一致,请重新输入');
            }
          })
          .catch((info) => {
            console.log('Validate Failed:', info);
          });
      }}
    >
      <Form
        form={form}
        layout="vertical"
        name="form_in_modal"
        initialValues={{
          modifier: 'public',
        }}
      >
        <Form.Item
          name="oldPassword"
          label="输入旧密码"
          rules={[
            {
              required: true,
              message: '请输入旧密码',
            },
          ]}
        >
          <Input.Password />
        </Form.Item>

        <Form.Item
          name="password"
          label="输入新密码"
          rules={[
            {
              required: true,
              message: '请输入新密码',
            },
          ]}
        >
          <Input.Password />
        </Form.Item>
        <Form.Item
          name="confirmPassword"
          label="确认新密码"
          rules={[
            {
              required: true,
              message: '请确认新密码',
            },
          ]}
        >
          <Input.Password />
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default CollectionCreateForm;
